<template>
  <div class="product">
    <div class="productall">
      <div class="product-top">
        <span class="title">委托债权</span>
        <a href="" class="find">查看更多>></a>
      </div>
      <div class="product-btn">
        <div class="product-left">
          <a href="">自选产品</a>
          <a href="">业务规则</a>
        </div>
        <div class="product-right">
          <keep-alive>
            <div :is="currentView"></div>
          </keep-alive>
        </div>
      </div>
      <div></div>
    </div>
  </div>
</template>

<script>
import ComponentTmpentrust from './entrust/Tmpentrust'
export default {
  name: '',
  data () {
    return {
      currentView: 'ComponentTmpentrust',
      navList: [
        {text: '超短融', isActive: true, tag: 'ComponentTmpdefault'},
        {text: '短融', isActive: false, tag: 'ComponentTmpdefault'},
        {text: '非公开定向', isActive: false, tag: 'ComponentTmpdefault'},
        {text: '债权融资计划', isActive: false, tag: 'ComponentTmpplan'},
        {text: '其他', isActive: false, tag: 'ComponentTmpdefault'}
      ]
    }
  },
  components: {
    ComponentTmpentrust
  },
  methods: {
    toggleTabs (tabText, data) {
      this.navList.forEach(function (obj) {
        obj.isActive = false
      })
      data.isActive = !data.isActive
      this.currentView = tabText
    }
  }
}
</script>

<style scoped type="text/stylus" lang="stylus">
.product
  background: url('../../../assets/img/wtzq2.png') no-repeat; background-size: cover;width:100%;height:507px
  .productall
    width:1200px;height:464px;margin:20px auto 18px  auto;
    .product-top
      width:1200px;height:49px;line-height:49px;
      .title
        cursor: pointer;font-size: 24px; color: #ffffff;
      .active
        color:#BA9959 !important
      .indent
        cursor: pointer; margin-left: 20px; font-size: 16px; color: rgb(50, 50, 50);
      .find
        font-size: 18px;color: #999999;margin-right:0px;display:block;float:right;
    .product-btn
      width:1200px;height:415px;
      .product-left,.product-right
        float:left;
      .product-left
        width:288px;height:415px;
        background:url("../../../assets/img/new17.png") no-repeat;background-size:100% 100%
        a:first-child
          margin-top:310px;
        a
          display:block;
          border:1px solid #fff;font-size:18px;width: 180px;height: 36px;line-height:36px;color:#fff
          text-align:center;margin:0 auto;margin-top:17px;
      .product-right
        width:900px;height:415px;
        background:#fff;margin-left:10px;
</style>
